<template>
  <view class="content">
    <!-- <view class="top">
      <u-icon name="close" color="#666" size="22" @click="showSave = true"></u-icon>
      <image src="/static/img/released_on.png" style="height: 50rpx;" mode="heightFix" v-if="params.title && params.info" @click="handleSend"></image>
      <image src="/static/img/released.png" style="height: 50rpx;" mode="heightFix" v-else></image>
    </view> -->
    <view style="padding: 20rpx;" class="title">
      <!-- <u--input v-model="params.title" border="none" placeholder="请输入完整的帖子标题（建议5-40字）" customStyle="font-weight: 700;"></u--input> -->
      <view style="margin-right: 20rpx;">评价</view>
      <u-rate activeColor="#F56C6C" :minCount="1" :size="24" :count="5" v-model="params.level"></u-rate>
      <view class="level" v-if="params.level == 1">非常差</view>
      <view class="level" v-if="params.level == 2">差</view>
      <view class="level" v-if="params.level == 3">一般</view>
      <view class="level" v-if="params.level == 4">满意</view>
      <view class="level" v-if="params.level == 5">非常满意</view>
    </view>
    <view style="margin: 10rpx;">
      <u-line></u-line>
    </view>
    <u--textarea v-model="params.title" border="none" placeholder="请输入您的评价" height="140" autoHeight maxlength="3600"></u--textarea>
    <u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" uploadIcon="plus" multiple :maxCount="9" :max-size="10 * 1024 * 1024" @oversize="oversize"></u-upload>
    <view style="margin: 10rpx;">
      <u-line></u-line>
    </view>
    <view class="but">
      <u-button color="#f56c6c" type="primary" :disabled="!params.title || !params.level" @click="handleSend" :text="!params.title || !params.level?'请评价':'提交评价'"></u-button>
    </view>
    <u-popup :show="showSave" @close="showSave = false" :round="15">
      <view class="save">
        <view class="save-item" style="color: #999;font-size: 24rpx;">保存内容再退出</view>
        <view class="save-item" style="color: #406FFF" @click="handleSave">保存</view>
        <view class="save-item" @click="handleBack">不保存</view>
        <view class="save-item" @click="showSave = false">取消</view>
      </view>
    </u-popup>
  </view>
</template>
<script>
import { addPostApi } from "@/sheep/api/index";
import { baseUrl, clientId } from "@/sheep/request/baseUrl";

export default {
  name: "index",
  data() {
    return {
      params: {
        title: "",
        imgId: "",
        level: null,
        watchId: "",
      },
      fileList1: [],
      showSave: false,
    };
  },
  onShow(options) {},
  onLoad(options) {
    if (options?.watchId) {
      this.params.watchId = options.watchId;
    }
    if (options?.waiterId) {
      this.params.waiterId = options.waiterId;
    }
    if (options?.goodsOrderId) {
      this.params.orderId = options.goodsOrderId;
    }
    const post = uni.getStorageSync("post");
    if (post) {
      //json转对象
      this.params = JSON.parse(post);
    }
    const fileList1 = uni.getStorageSync("fileList1");
    if (fileList1) {
      //json转对象
      this.fileList1 = JSON.parse(fileList1);
    }
  },
  methods: {
    // 文件超出大小限制
    oversize() {
      uni.showToast({
        title: "上传最大不能超过10M",
        icon: "none",
      });
    },
    handleSend() {
      if (!this.params.title) {
        uni.showToast({
          title: "请输入评价",
          icon: "none",
        });
        return;
      }
      if (!this.params.level) {
        uni.showToast({
          title: "请选择评价等级",
          icon: "none",
        });
        return;
      }
      if (Array.isArray(this.fileList1)) {
        if (this.fileList1.length > 0) {
          this.fileList1.forEach((item, index) => {
            if (item.ossId == undefined || item.ossId == "undefined") {
              uni.showToast({
                title: "图片上传有误",
                icon: "none",
              });
              return;
            }
            if (index === 0) {
              this.params.imgId = item.ossId;
            } else {
              this.params.imgId = this.params.imgId + "," + item.ossId;
            }
          });
        } else {
          this.params.imgId = "";
        }
      }
      uni.showLoading({});
      addPostApi(this.params).then((res) => {
        uni.hideLoading();
        if (res.code == 200) {
          uni.showToast({
            title: "评价发布成功",
            icon: "none",
          });
          setTimeout(() => {
            this.handleBack();
          }, 500);
        }
      });
    },
    // 上传图片
    async afterRead(event) {
      let lists = [].concat(event.file);
      let fileListLen = this[`fileList${event.name}`].length;
      lists.map((item, index) => {
        this[`fileList${event.name}`].push({
          ...item,
          status: "uploading",
          message: "上传中",
        });
      });
      for (let i = 0; i < lists.length; i++) {
        const result = await this.uploadFilePromise(lists[i].url, lists, event);
        let item = this[`fileList${event.name}`][fileListLen];
        this[`fileList${event.name}`].splice(
          fileListLen,
          1,
          Object.assign(item, {
            status: "success",
            message: "",
            url: result.url,
            name: result.fileName,
            ossId: result.ossId,
          })
        );
        fileListLen++;
      }
    },
    uploadFilePromise(url, lists, event) {
      let token = uni.getStorageSync("token");
      let headerToken = "Bearer " + token;
      return new Promise((resolve, reject) => {
        let a = uni.uploadFile({
          url: baseUrl + "/resource/oss/upload",
          filePath: url,
          name: "file",
          header: {
            Authorization: headerToken,
            clientId: clientId,
          },
          formData: {
            user: "test",
          },
          success: (res) => {
            let data = JSON.parse(res.data);
            if (data.code == 200) {
              resolve(data.data);
            } else {
              if (lists.length > 0) {
                lists.map((item, index) => {
                  this[`fileList${event.name}`].splice(index, 1);
                });
              }
              uni.showToast({
                title: data.msg,
                icon: "none",
              });
            }
          },
        });
      });
    },
    // 删除图片
    deletePic(event) {
      this[`fileList${event.name}`].splice(event.index, 1);
    },
    //删除缓存并返回
    handleBack() {
      uni.removeStorageSync("post");
      uni.removeStorageSync("fileList1");
      uni.navigateBack();
    },
    handleSave() {
      //转json
      let post = JSON.stringify(this.params);
      uni.setStorageSync("post", post);
      let fileList1 = JSON.stringify(this.fileList1);
      uni.setStorageSync("fileList1", fileList1);
      uni.navigateBack();
    },
  },
};
</script>

<style scoped lang="scss">
.content {
  background-color: #fff;
  height: 100%;
  padding: 30rpx;
  .agreement {
    width: 100%;
    text-align: center;
    color: #999999;
    font-size: 24rpx;
    margin-top: 40rpx;
  }
  .but {
    margin-top: 40rpx;
  }
  .top {
    margin: 20rpx 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}
::v-deep.u-textarea__field {
  min-height: 400rpx !important;
}
.save {
  padding: 30rpx;
  text-align: center;
  .save-item {
    line-height: 70rpx;
    font-size: 28rpx;
  }
}
.title {
  display: flex;
  align-items: center;
  .level {
    color: #999;
    font-size: 28rpx;
    margin-left: 20rpx;
  }
}
</style>
